import { hasAuth } from '@/plugins/permission'
import { Directive, DirectiveBinding } from 'vue'

/**
 * 按钮权限
 */
export const hasPerm: Directive = {
	mounted(el: HTMLElement, binding: DirectiveBinding) {
		// DOM绑定需要的按钮权限标识
		const { value: requiredPerms } = binding
		if (requiredPerms) {
			if (!hasAuth(requiredPerms)) {
				el.parentNode && el.parentNode.removeChild(el)
			}
		} else {
			throw new Error(
				"need perms! Like v-has-perm=\"['sys:user:add','sys:user:edit']\""
			)
		}
	}
}

/**
 * 角色权限
 */
export const hasRole: Directive = {
	mounted(el: HTMLElement, binding: DirectiveBinding) {
		// DOM绑定需要的角色编码
		const { value: requiredRoles } = binding
		if (requiredRoles) {
			if (!hasAuth(requiredRoles, 'role')) {
				el.parentNode && el.parentNode.removeChild(el)
			}
		} else {
			throw new Error("need roles! Like v-has-role=\"['admin','test']\"")
		}
	}
}
